<template>
  <div class="bi-card">
    <div class="bi-card--header">
      <div class="bi-card--header--left">
        <span class="bi-card--title">{{ title }}</span>
<!--        <BiTooltip v-if="tips.length" :tips="tips" />-->
        <div v-if="subtitle" class="bi-card--subtitle">{{ subtitle }}</div>
      </div>
      <div class="bi-card--header--right">
        <slot name="right"></slot>
      </div>
    </div>
    <div class="bi-card-content">
      <slot />
    </div>
  </div>
</template>
<script>

export default {
  name: 'YsCard',
  props: {
    title: {
      type: String,
      default: 'Card  标题'
    },
    desc: {
      type: [String, Array],
      default: ''
    },
    subtitle: {
      type: String,
      default: ''
    }
  },
  computed: {
    tips() {
      if (!props.desc) return []
      if (typeof props.desc === 'string') return [{ desc: props.desc }]
      if (Array.isArray(props.desc)) return props.desc
      return []
    }
  }
}

</script>
